﻿@ModelType IEnumerable(Of SiiabCamarasMovil.Camaras)
@Code
    ViewData("Title") = "SAV Vistas Camáras"
    Layout = "~/Views/Shared/MasterSite.vbhtml"
    ViewData("ContentTitle") = "Vistas Camáras"
End Code
@Section MenuList
    <ul data-role="listview" data-icon="false" data-theme="c">
        <li><a data-ajax = "false" href="@Url.Action("Index", "Site")">
            <img src="@Href("~/Content/images/ic_inicio.png")" class="ui-li-icon imgPanelMenu" alt="Inicio"/>
            <hx>
            Inicio</hx>
            <p>
                Menu Principal</p>
        </a></li>
        <li><a href="#">
            <hx>
            Monitoreo</hx>
            <p>
            </p>
        </a></li>
        <li><a data-ajax="false" href="#">
            <img src="@Href("~/Content/images/sav/ic_elegirvistas.png")"class="ui-li-icon imgPanelMenu" alt="VistasCamaras"/>
            <hx>
            Elegir Vista</hx>
            <p>
                Monitoreo de Cámaras</p>
        </a></li>
    </ul>
End Section
@Section HeaderScriptStyles
<meta Http-Equiv="Cache-Control" Content="no-cache">
<meta Http-Equiv="Pragma" Content="no-cache">
<meta Http-Equiv="Expires" Content="0">
<meta Http-Equiv="Pragma-directive: no-cache">
<meta Http-Equiv="Cache-directive: no-cache">
    <link href="@Url.Content("~/css/idangerous.swiper.css")" rel="stylesheet" type="text/css" />
    <script src="@Url.Content("~/js/screenfull.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/js/jsUtilMobile.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/js/jsBackendListaCamaras.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/js/idangerous.swiper-2.4.min.js")" type="text/javascript"></script>

    <style type="text/css">
        html, body, div[data-role ="page"]
        {
            height: 100%;
            width: 100%;
            margin: 0px;
            padding: 0px;
        }
      .ui-content{
            height: 100%;
            width: 100%;
            margin: 0px;
            padding: 0px;
        }

        #panelCamaras
        {
            width: 100%;
            height: 90%;
        }
  .pageFullScreen{

   background: #DEE6F3 !important; 
    }

.slide-uno {
  background: #9FCBED;
}
.slide-dos{
  background: #ADE0EE;
}
.slide-tres {
  background: #CEEBEA;
}
.slide-cuatro {
  background: #8FD2CA;
}
.slide-uno-select {
  background: #007DC3;
}
.slide-dos-select{
  background: #00A4E4;
}
.slide-tres-select {
  background: #00A0AF;
}
.slide-cuatro-select {
  background: #00AE9E;
}


.container-slide {display: table; height: 100%; width:100%; }
.helper-slide { top: 50%;display: table-cell; vertical-align: middle;}



.pagination {
  position: absolute;
  z-index: 20;
  left: 10px;
  bottom: 10px;
}
.swiper-pagination-switch {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 8px;
  background: #6C6D70;
  margin-right: 5px;
  opacity: 0.8;
  border: 1px solid #fff;
  cursor: pointer;
}
.swiper-visible-switch {
  background: #6C6D70;
}
.swiper-active-switch {
  background: #211E1E;
}



@@media all and (min-width: 800px) {
 .swiper-container {
  width: 650px;
  height: 200px;
  color: #fff;
  text-align: center;
}
}

@@media all and (max-width: 799px) {
.swiper-container {
  width: 450px;
  height: 200px;
  color: #fff;
  text-align: center;
}
}     


    </style>
End Section
@Html.Hidden("UrlListaCamaras", Url.Action("ListaCamaras", "VerCamaras"))
@Html.Hidden("UrlActualizarCamaras", Url.Action("ActualizarCamaras", "VerCamaras"))
@Html.Hidden("UrlListaVistas", Url.Action("ListaVistas", "VerCamaras"))
@Html.Hidden("ImgNotFound", Href("~/Content/images/sav/camara-no-disponible.png"))

<div id="titleContainer">
    <div class="imgTextContainer">
        <div class="imgTextThumb">
            <img id="imgSav" src="@Href("~/Content/images/sav/ic_SAV.png")"
                         alt="SAV"/></div>
        <div class="imgTextContent">
            <h4 id="vistaActual" class="imgTextContentTitle">
                @ViewData("ContentTitle")</h4>
        </div>
    </div>
    <hr class="horizontalLineSav">
</div>
<div id="errorPage" class="alignCenter">
</div>
<div id="panelContent">
    <div id="panelImgVista" style="text-align: right;">
        <img id="imgVistas" src="@Href("~/Content/images/sav/ic_mostrar_vistas.png")"
                         alt="imgVistas"/>
    </div>
    <div id="panelVistas">
        <p>
        </p>
        <div class="swiper-container" id="swipercontainer">
            <div class="swiper-wrapper" id="swiperwrapper">
            </div>
            <div class="pagination">
            </div>
        </div>
        <p>
        </p>
    </div>
    <section id="panelContentCameras">
    <div id='panelCloseFullScreen' class="alignRight">
        <a href="#" id="closeFullScreen"  data-role="button" data-icon="delete" data-iconpos="notext" class="ui-btn-right" >Cerrar</a>
    </div>
    <div id='panelCamaras'>
        @Html.Partial("_PartialCamera", Model)
    </div>
    </section>

</div>
      <p>
        </p>




